<script setup lang="ts">
import { ref } from 'vue';
import { jlagvselectMateriel } from '../../../service/api/modules/agv/menu';
import TopTable from './modules/top-table.vue';
import BottomTable from './modules/bottom-table.vue';
import RightContent from './modules/right-content.vue';

const topTableData = ref([]);

function isTableDataOne() {
  jlagvselectMateriel('').then(({ data, error }) => {
    if (!error) {
      data.forEach((item, index) => {
        item.index = index + 1;
      });
      topTableData.value = data;
    }
  });
}

isTableDataOne();
</script>

<template>
  <div class="w-full">
    <ARow class="h-full w-full">
      <ACol :span="9" class="h-full">
        <div class="h-50%">
          <TopTable :table-data="topTableData" @get-top-data="isTableDataOne" />
        </div>
        <div class="h-50%">
          <BottomTable />
        </div>
      </ACol>
      <ACol :span="15" class="h-full flex-center">
        <RightContent :select-data="topTableData" />
      </ACol>
    </ARow>
  </div>
</template>

<style></style>
